<template>
  <div class="changepass" id="pass_change" set>
    <form class="layui-form zfb-set">
      <div class="layui-form-item">
        <label class="layui-form-label">旧密码</label>
        <div class="layui-input-block">
          <input type="password" v-model="oldpwd" name="oldpwd" class="layui-input" placeholder="请输入">
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">新密码</label>
        <div class="layui-input-block">
          <input type="password" v-model="newpwd" name="newpwd" class="layui-input" placeholder="请输入">
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">确认密码</label>
        <div class="layui-input-block">
          <input type="password" v-model="newpwd2" name="newpwd2" class="layui-input" placeholder="请输入">
        </div>
      </div>
      <button id="passwoed_submit" @click="submit()" type="button">保存</button>
    </form>
  </div>
</template>
<script>
import * as api from '@/service/api'
export default {
  data () {
    return {
      loading: false,
      oldpwd: '',
      newpwd: '',
      newpwd2: ''
    }
  },
  methods: {
    async submit () {
      let check = pwd => {
        return /^(?!([a-zA-Z]+|\d+)$)[a-zA-Z\d]{6,16}$/.test(pwd)
      }
      if (!check(this.oldpwd) || !check(this.newpwd) || !check(this.newpwd2)) {
        window.layer.msg('密码长度需要保持在6-16位且同时需包包含字母和数字！', {
          icon: 2
        })
      } else if (this.newpwd !== this.newpwd2) {
        window.layer.msg('新密码二次输入需要一致！', {
          icon: 2
        })
      }
      this.loading = true
      try {
        await api.modifyPassword({
          oldPassword: this.oldpwd,
          password: this.newpwd
        })
        window.layer.msg('密码修改成功！')
      } catch (error) {
        console.log(error)
      }
      this.loading = false
    }
  }
}
</script>
